﻿<UserControl x:Class="DrawToolsLib.ColorPick"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="clr-namespace:DrawToolsLib"
    Height="150" Width="250" Loaded="UserControl_Loaded">
    <UserControl.Resources>
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid>
                            <Border 
        		                x:Name="Border"
        		                CornerRadius="6,6,0,0"
        		                Margin="0,0,0,0"
        		                Width="125" Height="20">
                                <ContentPresenter x:Name="ContentSite"
        			                VerticalAlignment="Center"
        			                ContentSource="Header"
        			                Margin="6,2,6,2" HorizontalAlignment="Left"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Border" 
                                    Property="Background" Value="#FF808080" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="False">
                                <Setter TargetName="Border" 
                                    Property="Background" Value="#FF2D2D2D" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style TargetType="{x:Type TabControl}" x:Key="TabControlStyle1">
            <Setter Property="Padding" Value="2,2,2,2"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabControl}">
                        <Grid ClipToBounds="true" SnapsToDevicePixels="true" KeyboardNavigation.TabNavigation="Local">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" x:Name="RowDefinition0"/>
                                <RowDefinition Height="*" x:Name="RowDefinition1"/>
                            </Grid.RowDefinitions>
                            <TabPanel x:Name="HeaderPanel" Grid.Row="0" IsItemsHost="true" Panel.ZIndex="1" KeyboardNavigation.TabIndex="1"/>
                            <Border x:Name="ContentPanel" Grid.Row="1" Background="{TemplateBinding Background}" 
                                    BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
                                    KeyboardNavigation.DirectionalNavigation="Contained" KeyboardNavigation.TabIndex="2" 
                                    KeyboardNavigation.TabNavigation="Local">
                                <ContentPresenter Margin="{TemplateBinding Padding}" x:Name="PART_SelectedContentHost" 
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" ContentSource="SelectedContent"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Converts tooltype to bool for checking controls -->
        <d:PreviewColorConverter x:Key="PreviewColConv"/>
        <d:ColorToPointerConverter x:Key="ColPointConv"/>
        <d:ColorToRainbowPointerConverter x:Key="ColRPointConv"/>
        <d:DoubleToByteConverter x:Key="DoubleByteConv"/>
        <d:ColorToBrushConverter x:Key="ColBrConv"/>
        <d:ColorToHexConverter x:Key="ColHexConv"/>
    </UserControl.Resources>

    <TabControl Background="#FF808080" Style="{DynamicResource TabControlStyle1}">
        <TabItem Header="Editor" x:Name="EditorTab" Foreground="#FFFFFFFF" >
            <Grid ClipToBounds="True">
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.25*"/>
                    <RowDefinition Height="0.25*"/>
                    <RowDefinition Height="0.25*"/>
                    <RowDefinition Height="0.25*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="120"/>
                    <ColumnDefinition Width="0.08*"/>
                    <ColumnDefinition Width="0.07*"/>
                    <ColumnDefinition Width="0.35*"/>
                </Grid.ColumnDefinitions>
                <Rectangle x:Name="ColorLayer" Grid.RowSpan="4">
                    <Rectangle.Fill>
                        <LinearGradientBrush EndPoint="1,0" StartPoint="0,0">
                            <GradientStop Color="#FFFFFFFF" Offset="0"/>
                            <GradientStop x:Name="PreviewColor" Offset="1"
                                Color="{Binding Color, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Converter={StaticResource PreviewColConv}}"/>
                        </LinearGradientBrush>
                    </Rectangle.Fill>
                </Rectangle>
                <Rectangle Stroke="#FF333333" x:Name="BWLayer" Grid.RowSpan="4" Cursor="Cross"
                    MouseDown="BWLayer_MouseDown" MouseMove="BWLayer_MouseMove" MouseUp="BWLayer_MouseUp">
                    <Rectangle.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF000000" Offset="1"/>
                            <GradientStop Color="#00000000" Offset="0"/>
                        </LinearGradientBrush>
                    </Rectangle.Fill>
                </Rectangle>
                <Ellipse x:Name="ColorPointer" Width="9" Height="9" Grid.RowSpan="4" StrokeThickness="2"
                    HorizontalAlignment="Left" VerticalAlignment="Top" IsHitTestVisible="False"
                    Margin="{Binding Color, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Converter={StaticResource ColPointConv}}">
                    <Ellipse.Stroke>
                        <RadialGradientBrush>
                            <GradientStop Color="#FF000000" Offset="0.75"/>
                            <GradientStop Color="#FFFFFFFF" Offset="1"/>
                        </RadialGradientBrush>
                    </Ellipse.Stroke>
                </Ellipse>
                <Rectangle x:Name="Rainbow" Stroke="#FF333333" Grid.Column="1" Grid.RowSpan="4" Margin="-1,0,0,0"
                    MouseDown="Rainbow_MouseDown" MouseMove="Rainbow_MouseMove" MouseUp="Rainbow_MouseUp">
                    <Rectangle.Fill>
                        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                            <GradientStop Color="#FFFF0000" Offset="0"/>
                            <GradientStop Color="#FFFFFF00" Offset="0.167"/>
                            <GradientStop Color="#FF00FF00" Offset="0.333"/>
                            <GradientStop Color="#FF00FFFF" Offset="0.5"/>
                            <GradientStop Color="#FF0000FF" Offset="0.667"/>
                            <GradientStop Color="#FFFF00FF" Offset="0.833"/>
                            <GradientStop Color="#FFFF0000" Offset="1"/>
                        </LinearGradientBrush>
                    </Rectangle.Fill>
                </Rectangle>
                <Rectangle x:Name="RainbowPointer" Stroke="#FF000000" Grid.Column="1" Grid.RowSpan="4" Height="4" 
                    RadiusX="2" RadiusY="2" VerticalAlignment="Top" IsHitTestVisible="False"
                    Margin="{Binding Color, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Converter={StaticResource ColRPointConv}}"/>
                <Slider x:Name="R" Grid.Column="3" VerticalAlignment="Center" 
                        Maximum="255" SmallChange="1" Value="255" />
                <TextBlock x:Name="Rtext" Background="#00000000" Foreground="#FFFF0000" Grid.Column="2" Grid.Row="0" 
                        Text="R" TextAlignment="Center" VerticalAlignment="Top" FontWeight="Bold"/>
                <TextBlock x:Name="Rvalue" Background="#00000000" Foreground="#FF333333" Grid.Column="2" Grid.Row="0"
                        Text="{Binding Value, ElementName=R, Converter={StaticResource DoubleByteConv}}" 
					    TextAlignment="Center" VerticalAlignment="Bottom" FontWeight="Bold" Height="12"  FontSize="8"/>

                <Slider x:Name="G" Background="#007B8CA6" Grid.Column="3" VerticalAlignment="Center"
                         Maximum="255" SmallChange="1" Value="0" Grid.Row="1" />
                <TextBlock x:Name="Gtext" Background="#00000000" Foreground="#FF00FF00" Grid.Column="2" Grid.Row="1" 
                         Text="G" TextAlignment="Center" VerticalAlignment="Top" FontWeight="Bold"/>
                <TextBlock x:Name="Gvalue" Background="#00000000" Foreground="#FF333333" Grid.Column="2" Grid.Row="1"
                        Text="{Binding Value, ElementName=G, Converter={StaticResource DoubleByteConv}}"
					    TextAlignment="Center" VerticalAlignment="Bottom" FontWeight="Bold" Height="12"  FontSize="8" />

                <Slider x:Name="B" Background="#007B8CA6" Grid.Column="3" VerticalAlignment="Center"
                         Maximum="255" SmallChange="1" Value="0" Grid.Row="2" />
                <TextBlock x:Name="Btext" Background="#00000000" Foreground="#FF0000FF" Grid.Column="2" Grid.Row="2" 
                         Text="B" TextAlignment="Center" VerticalAlignment="Top" FontWeight="Bold"/>
                <TextBlock x:Name="Bvalue" Background="#00000000" Foreground="#FF333333" Grid.Column="2" Grid.Row="2"
                        Text="{Binding Value, ElementName=B, Converter={StaticResource DoubleByteConv}}" 
					    TextAlignment="Center" VerticalAlignment="Bottom" FontWeight="Bold" Height="12"  FontSize="8" />

                <TextBox x:Name="ColorHex" Width="60" Background="#FF333333" Foreground="#FFFFFFFF" BorderBrush="{x:Null}"  
                         HorizontalAlignment="Left" Grid.Row="3" Grid.Column="2" Grid.ColumnSpan="2"
                          TextAlignment="Center" Margin="5,7,0,7" FontFamily="Courier New" MaxLength="6">
                    <Binding Converter="{StaticResource ColHexConv}" UpdateSourceTrigger="PropertyChanged"
                		RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type UserControl}}" Path="Color">
                    </Binding>
                </TextBox>
                <Rectangle x:Name="PreviewRectangle" Width="30" Height="30" Grid.Column="2" Grid.Row="3" 
                    Grid.ColumnSpan="2" HorizontalAlignment="Right" Stroke="#FF333333"
                    Fill="{Binding Color, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Converter={StaticResource ColBrConv}}">
                </Rectangle>
            </Grid>
        </TabItem>
        <TabItem Header="Color resources" x:Name="ColorResourcesTab" Foreground="#FFFFFFFF">
            <DockPanel>
                <DockPanel.Resources>
                    <DataTemplate x:Key="ColorItem">
                        <DockPanel LastChildFill="True" Height="18">
                            <Rectangle Height="15" DockPanel.Dock="Left" Fill="{Binding Name, Mode=OneTime}" 
                                       Width="40" Stroke="Black"/>    
                            <TextBlock Height="18" DockPanel.Dock="Left" Margin="3,2,5,0" Width="110"
                                       Foreground="Black" FontSize="11" Text="{Binding Name, Mode=OneTime}"/>
                            <TextBlock Height="18" DockPanel.Dock="Left" Margin="3,3,0,0" FontFamily="Courier New" FontWeight="Bold"
                                       Foreground="Black" FontSize="11" Text="{Binding Name, Converter={StaticResource ColHexConv}, Mode=OneTime}"/>                           
                        </DockPanel>
                    </DataTemplate>
                </DockPanel.Resources>
                <TextBlock x:Name="ColorsHeader" Background="#00000000" Foreground="#FF000000" 
            		TextAlignment="Center" FontWeight="Bold"  FontSize="11" DockPanel.Dock="Top" Text="Select color from Colors list:" HorizontalAlignment="Left" Margin="10,10,0,0" />

                <ComboBox x:Name="ColorsBox" Margin="10,10,10,0" DockPanel.Dock="Top" Height="24" 
                          IsSynchronizedWithCurrentItem="True" ItemTemplate="{DynamicResource ColorItem}" SelectedIndex="0"/>
        		<Rectangle x:Name="PreviewRectangle_Copy" Width="30" Height="30" Stroke="#FF333333"
        			Fill="{Binding Path=Color, Converter={StaticResource ColBrConv}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" HorizontalAlignment="Right" Margin="0,0,10,20" VerticalAlignment="Bottom" DockPanel.Dock="Right"/>
        		<TextBox x:Name="ColorHex_Copy" Width="60" Background="#FF333333" Foreground="#FFFFFFFF" BorderBrush="{x:Null}"
        			TextAlignment="Center" FontFamily="Courier New" MaxLength="6" 
                    Text="{Binding Path=Color, Converter={StaticResource ColHexConv}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, UpdateSourceTrigger=PropertyChanged}" Height="17.5" DockPanel.Dock="Right" HorizontalAlignment="Right" Margin="0,1,10,0"/>
        		<Button Content="Apply Selected Color" Height="24" DockPanel.Dock="Right" HorizontalAlignment="Left" Margin="10,0,0,0" x:Name="ApplyButton" FontSize="11" Width="118" Click="ApplyButton_Click"/>
        	</DockPanel>
        </TabItem>
    </TabControl>
</UserControl>
